import React, { Component } from 'react'
import { browserHistory } from 'react-router';
import { Modal, Button, Breadcrumb, Select } from 'antd';
import { fetchData } from '../AjaxConsumer'
const Option = Select.Option;
const confirm = Modal.confirm;
import styles from './index.scss'
import cookie from 'react-cookie';
import { Link } from 'react-router';



export default class TopHeader extends Component {
    constructor(props) {
        super(props);
        this.state = {
            menuCtrlImg: '',
            userName: '',
            optionData: null
        }
    }
	//点击折叠显示效果
    handClick = () => {
        let menuCtrlImg = this.state.menuCtrlImg;
        if (menuCtrlImg == "") {
            menuCtrlImg = "lachu";
        } else {
            menuCtrlImg = "";
        }
        this.setState({
            menuCtrlImg: menuCtrlImg
        })
    };

    longOutHandle = () => {
    //   console.log("你竟然点击了退出");
      confirm({
        title: '确定退出吗?',
        onOk() {
            // cookie.remove('userId', { path: '/' });
            // cookie.remove('userPwd', { path: '/' });
            $.ajax({
                url: '/base/auth/logout',
                type: 'get',
                dataType: 'json'
            }).done(function (data, status, xhr) {}.bind(this));
            browserHistory.push('/');
        },
        onCancel() {
        },
      });
    };
    //获取用户信息
    userinfo =() => {
        const options= {
            url: '/base/auth/userinfo',
            type: 'get',
            condition:{
            }
        };
        fetchData(this, options, (res) => {
             this.setState({
                userName: res.data.userName,
            })
        });
    };
    componentDidMount () {
        this.userinfo();
    }

    render() {
        let userName = this.state.userName ? this.state.userName : '闯入者';
        let optionData = this.state.optionData ? this.state.optionData : null;
        return (
            <div className="top">
                <i className={"shouqi " + this.state.menuCtrlImg} onClick={this.props.hck}> </i>
                <div className={styles.topRight}>
                    <a className={styles.notice}><span className={styles.noticeNumber}>3</span></a>
                    <i className={styles.splitSolid}></i>
                    <a className="changeStyle" style={{marginRight: '10px'}}></a>
                    <span style={{fontSize: '12px', color: '#fff', cursor: 'pointer'}}>{userName}</span>

                    <span className={styles.configConfirm}>
                        <a href="javascript: void(0);" className={styles.config}><i className={styles.arrow}></i></a>
                        <ul className={styles.downContent}>
                            <li><a className={styles.tuichu} href="javascript: void(0);"
                                   onClick={this.longOutHandle}>退出</a></li>
                        </ul>
                    </span>

                </div>
            </div>
        );
    }
}
